<template>
    <div>
        <!-- 新增弹窗 -->
        <a-modal
         :width=680
         :visible="authorizationVisibleShow" 
         :title="addEditParameter.id?'编辑':'新增'" 
         @ok="authorizationVisibleShow = false" 
         :forceRender="true"
         :confirmLoading="confirmLoading"
         @cancel="authorizationVisibleShow = false">
            <a-spin size="large" :spinning="spinning">
                <div class="roleAuthorization-increase">
                    <a-form v-if="authorizationVisibleShow" :form="form">
                        <a-form-item label="授权角色">
                            <a-tree
                                checkable
                                :tree-data="treeData"
                                v-model:expandedKeys="expandedKeys"
                                v-model:selectedKeys="selectedKeys"
                                v-model:checkedKeys="checkedKeys"
                                @check="treeCheck"
                            >
                            </a-tree>
                        </a-form-item>
                    </a-form>
                </div>
            </a-spin>
        </a-modal>
    </div>
</template>
<script>
import {typeInput, typeNumber, typeSelect, typeCheckbox, typeRadio} from '@/components/compSearchCriteria/ContractType'
import compSelector from '@/components/compSelector/compSelector'
import validator from '@/common/validator'
import {queryAllRoleAndAuth,addMhpzRole} from './service/index'
export default {
    components:{
        compSelector
    },
    data(){
        return{
            addEditParameter:{},
            spinning:true,
            form: this.$form.createForm(this, { name: 'coordinated' }),
            authorizationVisibleShow:false,
            confirmLoading:false,
            typeSelect:typeSelect,
            formState:{},
            rules:{
                fmc: [{
                    required: true,
                    message: '请输入名称',
                    trigger: 'blur',
                }],
                flj: [{
                    required: true,
                    message: '请输入路径',
                    trigger: 'blur',
                }],
            },
            submittedSuccessfully:false,
            treeData:[],
            expandedKeys:[],
            selectedKeys:[],
            checkedKeys:[],
        }
    },
    mounted(){
    },
    updated(){
        this.cancelLoading()
    },
    methods:{
        getData(val){//获取数据
            this.addEditParameter = val
            this.formState = val
            this.getTreeData(val)
        },
        getTreeData(val){
            queryAllRoleAndAuth({id:val.id}).then(res=>{
                if(res.code == 200){
                    this.treeData = res.result.allRoles
                    this.expandedKeys = res.result.roleIds?res.result.roleIds:[]
                    this.selectedKeys = res.result.roleIds?res.result.roleIds:[]
                    this.checkedKeys = res.result.roleIds?res.result.roleIds:[]
                    
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        cancelLoading(){
            let timer = setInterval((val)=>{
                this.spinning = false
                clearInterval(timer);
            },500)
            
        },
        treeCheck(key,e){
            //console.log(key)
            //console.log(e.node.eventKey)
            this.spinning = true
            addMhpzRole({fmhid:this.formState.id,froleid:e.node.eventKey}).then(res=>{
                this.cancelLoading()
                if(res.code == 200){
                    this.$message.success(res.message)
                    this.getTreeData({id:this.formState.id})
                }else{
                    this.$message.warning(res.message)
                    this.getTreeData({id:this.formState.id})
                }
            })

        },
        handleOk(){
            
            this.handleSubmit()
        }
    }

}

</script>
<style lang="less">
/* .ant-form-item-label{
    font-weight: 600;
} */
.roleAuthorization-increase{
    height: calc(100vh - 310px);
    overflow-y: auto;
    .ant-modal-title{
        font-weight: 600;
    }
    .ant-modal-header{
        background: #5ca3e5;
    }
    .ant-upload-list{
        display: none !important;
    }
    .ant-modal-footer .ant-btn-primary{
        border: 1px solid #5ca3e5 !important;
        background-color: #5ca3e5 !important;
        color: #fff !important;
    }
}
 
</style>